<template>
  <div class="pagination">
    <el-pagination :hide-on-single-page="true" @current-change="handleCurrentChange" background layout="prev, pager, next" :total="total"></el-pagination>
  </div>
</template>

<script>
export default {
  props: {
    total: {
      type: Number,
      required: true,
    },
  },
  methods:{
    handleCurrentChange(val) {
      this.$emit("currentPage",val)
    }
  }
};
</script>

<style lang="scss" scoped>
  .pagination{
    .el-pagination{
      padding: 0;
      display: flex;
      justify-content: flex-end;
    }
  }
</style>